<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
<%@ include file="/static/include/common.inc"%>
<title>青州市名卡管理系统</title>
<link rel="shortcut icon"
	href="https://github.com/shuaijunlan/Autumn-Framework/raw/master/favicon.ico"
	type="image/x-icon" />
<link rel="stylesheet" href="static/admin/css/layui.css">
<link rel="stylesheet" href="static/layui_v2.2.3/css/zbyui.css">
<link rel="stylesheet" href="static/admin/css/main.css" media="all">
<script src="static/js/jquery-1.11.2.js"></script>
<script src="static/layui_v2.2.3/layui.js" charset="utf-8"></script>
</head>

<body>
	
					<ul class="layui-tab-title">
						<li class="layui-this">用户管理</li>

					</ul>

					<div class="layui-tab-content">
						<div class="layui-tab-item layui-show" style="margin: 10px">

							<div class="buttonTable">
								<blockquote class="layui-elem-quote mylog-info-tit">
									<div class="layui-inline">
										<form class="layui-form" id="userSearchForm">
											<!-- <div class="layui-input-inline" style="width: 110px;">
												<select id="searchTerm">
													<option value=""></option>
													<option value="user_name">用户名</option>
													<option value="real_name">真实姓名</option>
													<option value="email">邮箱</option>
												</select>
											</div> -->
											<div class="layui-input-inline" style="width: 145px;">
												<input type="text" name="username" value=""
													placeholder="请输入用户名" class="layui-input search_input">
											</div>
										</form>
									</div>
									<div class="layui-inline">
										<button class="layui-btn">查询</button>
									</div>
								</blockquote>
							</div>

							<!-- <table class="layui-table"  
								lay-data="{ url:'admin/user/load.do', cache:false,page: {	layout: [ 'prev', 'page', 'next'] 
											,groups: 3 ,prev: '上一页' ,next: '下一页',theme:'user'} , id:'userTable'}"
								lay-filter="tablename">
								<thead>
									<tr>
										<th lay-data="{field:'userName',  }">用户名</th>
										<th lay-data="{field:'realName', }">真名</th>
										<th lay-data="{field:'userStatusStr', }">用户状态</th>
										<th lay-data="{field:'userTypeStr', }">用户类型</th>
										<th lay-data="{field:'email', }">邮箱</th>
										<th lay-data="{field:'phone', }">手机</th>
										<th lay-data="{fixed: 'right', width:356, align:'center', toolbar: '#barDemo'}"></th>
									</tr>
								</thead>
							</table> -->
							<table class="layui-table" id="zby-table" lay-filter="tablename" >
				
							</table>

							<script type="text/html" id="barDemo">
           						<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
           						<a class="layui-btn layui-btn-xs" lay-event="restart">恢复</a>
           						<a class="layui-btn layui-btn-danger  layui-btn-xs" lay-event="forbidden">禁用</a>
							</script>
						</div>
					</div>
	<script type="text/javascript">
		$.ajaxSetup({
			cache : false
		});
		layui.use('table', function() {
			var table = layui.table;
			//监听表格复选框选择
			table.on('checkbox(tablename)', function(obj) {
				console.log(obj)
			});
			
			//第一个实例
			var tableObj = table.render({
			    elem: '#zby-table',
			    url: 'admin/user/load.do', //数据接口,
			    page: true, //开启分页,
			    where: {articleName:$("#articleName").val()},
			    cols: [[ //表头
			      {field: 'userName', title: '用户名',sort: true, fixed: 'left'}
			      ,{field: 'realName', title: '真名', }
			      ,{field: 'userStatusStr', title: '用户状态', sort: true}
			      ,{field: 'userTypeStr', title: '用户类型' } 
			      ,{field: 'email', title: '邮箱' }
			      ,{field: 'phone', title: '手机'}
			      ,{fixed: 'right',align:'center', toolbar: '#barDemo'}
			    ]],
			    id:	"zby-reload",
			    response:{
			    	
			    }
			  });
			
			//监听工具条
			table.on('tool(tablename)', function(obj) {
				var data = obj.data;
				if (obj.event === 'forbidden') {
					if(confirm('确定要禁用么')){ //只有当点击confirm框的确定时，该层才会关闭
						$.ajax({
							url : "admin/user/forbidden.do",
							data : {
								"userId" : data.userId
							},
							type : 'post',
							async : false,//这里表示同步
							error : function(data) {
								console.log(data);
							}
						});
						table.reload('zby-reload', {
							page : {
								curr : 1
							//重新从第 1 页开始
							},
						});
					    layer.close(index)
					}
					
				}else if(obj.event === 'update'){
					if(data.userTypeStr=='后台管理员'){
						layer.open({
							type : 2,
							title : '用户修改',
							shadeClose : false,
							move : false,
							area : [ '700px', '450px' ],
							maxmin : true,
							closeBtn : 0,
							content : 'admin/user/update.do?userId=' + data.userId,
							btn : [ '关闭' ],
							yes : function() {
								layer.closeAll();
							}
						});
					}else{
						layer.msg('改用户不能被修改'); 
					}
					
				} else if (obj.event === 'restart') {
					$.ajax({
						url : "admin/user/restart.do",
						data : {
							"userId" : data.userId
						},
						type : 'post',
						async : false,//这里表示同步
						error : function(data) {
							console.log(data);
						}
					});

					table.reload('zby-reload', {
						page : {
							curr : 1
						//重新从第 1 页开始
						},
					});
				} else if (obj.event === 'detail') {
					layer.open({
						type : 2,
						title : '用户详情',
						shadeClose : false,
						move : false,
						type : 2,
						area : [ '700px', '450px' ],
						maxmin : true,
						closeBtn : 0,
						content : 'admin/user/view.do?userId=' + data.userId,
						btn : [ '关闭' ],
						yes : function() {
							layer.closeAll();
						}
					});
				}
			});

			$('.buttonTable .layui-btn').on('click', function() {
				table.reload('zby-reload', {
					page : {
						curr : 1
					//重新从第 1 页开始
					},
					where : {
						type : $("#searchTerm option:selected").val(),
						content : $(".search_input").val()
					}
				});

			});
		});

		$("#menu10").addClass("layui-nav-itemed");
		$("#UserManage").css("background-color", "#009688");
	</script>
</body>
</html>